<%@ page language="java" import="java.util.*" pageEncoding="utf8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Bootstrap Admin</title>
<meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<base href="<%=basePath%>>" />

<link rel="stylesheet" type="text/css"
	href="public/lib/bootstrap/css/bootstrap.css">
<link rel="stylesheet" type="text/css"
	href="public/lib/bootstrap/css/bootstrap-responsive.css">
<link rel="stylesheet" type="text/css"
	href="public/stylesheets/theme.css">
<link rel="stylesheet"
	href="public/lib/font-awesome/css/font-awesome.css">

<script src="public/lib/jquery-1.8.1.min.js" type="text/javascript"></script>

<!-- Demo page code -->

<style type="text/css">
#line-chart {
	height: 300px;
	width: 800px;
	margin: 0px auto;
	margin-top: 1em;
}

.brand {
	font-family: georgia, serif;
}

.brand .first {
	color: #ccc;
	font-style: italic;
}

.brand .second {
	color: #fff;
	font-weight: bold;
}
</style>

<!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->

<!-- Le fav and touch icons -->
<link rel="shortcut icon" href="../assets/ico/favicon.ico">
<link rel="apple-touch-icon-precomposed" sizes="144x144"
	href="../assets/ico/apple-touch-icon-144-precomposed.png">
<link rel="apple-touch-icon-precomposed" sizes="114x114"
	href="../assets/ico/apple-touch-icon-114-precomposed.png">
<link rel="apple-touch-icon-precomposed" sizes="72x72"
	href="../assets/ico/apple-touch-icon-72-precomposed.png">
<link rel="apple-touch-icon-precomposed"
	href="../assets/ico/apple-touch-icon-57-precomposed.png">
</head>

<!--[if lt IE 7 ]> <body class="ie ie6"> <![endif]-->
<!--[if IE 7 ]> <body class="ie ie7"> <![endif]-->
<!--[if IE 8 ]> <body class="ie ie8"> <![endif]-->
<!--[if IE 9 ]> <body class="ie ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!-->
<body>
	<!--<![endif]-->

	<jsp:include page="header.jsp"></jsp:include>
	<div class="container-fluid">
		<div class="row-fluid">
			<div class="span3">
				<jsp:include page="menu.jsp"></jsp:include>
			</div>
			<div class="span9">
				<h1 class="page-title">组列表</h1>
				<div class="btn-toolbar">
					<a href="admin/group/add.do">
						<button class="btn btn-primary">
							<i class="icon-plus"></i> 新组
						</button> </a>
					<div class="btn-group"></div>
				</div>
				<div class="well">

					<table class="table table-hover">
						<thead>
							<tr>
								<th>ID号</th>
								<th>组名</th>
								<th>描述</th>
							</tr>
						</thead>
						<tbody>
							<c:forEach items="${groups}" var="gp">
								<tr>
									<td><c:out value="${gp.id}"></c:out></td>
									<td><c:out value="${gp.name}"></c:out></td>
									<td><c:out value="${gp.description}"></c:out></td>
									<td><a
										href="admin/group/edit.do?id=<c:out value="${gp.id}"></c:out>"><i
											class="icon-pencil"></i> </a> <a
										href="admin/group/del.do?id=<c:out value="${gp.id}"></c:out>"
										role="button" data-toggle="modal"><i class="icon-remove"></i>
									</a></td>
								</tr>
							</c:forEach>
					</table>
				</div>
				<div class="pagination">
					<ul>
						<li><a href="#">Prev</a>
						</li>
						<li><a href="#">1</a>
						</li>
						<li><a href="#">2</a>
						</li>
						<li><a href="#">3</a>
						</li>
						<li><a href="#">4</a>
						</li>
						<li><a href="#">Next</a>
						</li>
					</ul>
				</div>

				<div class="modal small hide fade" id="myModal" tabindex="-1"
					role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal"
							aria-hidden="true">Ã</button>
						<h3 id="myModalLabel">Delete Confirmation</h3>
					</div>
					<div class="modal-body">
						<p class="error-text">
							<i class="icon-warning-sign modal-icon"></i>Are you sure you want
							to delete the user?
						</p>
					</div>
					<div class="modal-footer">
						<button class="btn" data-dismiss="modal" aria-hidden="true">Cancel</button>
						<button class="btn btn-danger" data-dismiss="modal">Delete</button>
					</div>
				</div>

			</div>
		</div>
	</div>

	<jsp:include page="footer.jsp"></jsp:include>

	<!-- Le javascript
    ================================================== -->
	<!-- Placed at the end of the document so the pages load faster -->
	<script src="public/lib/bootstrap/js/bootstrap.js"></script>
</body>
</html>


